import { Component } from 'react';
import { View, Input, Button } from '@tarojs/components';

class CustomInput extends Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ''
    }
  }
  handleChange = (e) => {
    // if (e.detail.key == 'Enter') {
    //   this.handleSubmit();
    // } else {
      this.setState({
        value: e.target.value
      })
    // }
  }
  handleSubmit = () => {
    if (this.state.value !== '') {
      this.props.addTodo(this.state.value);
      this.setState({
        value: ''
      })
    }
  }
  render() {
    return (
      <View>
        {/* onChange 要替换成 onInput，参见文档组件-Input */}
        <Input type='text' placeholder='please input...' value={this.state.value} bindinput onInput={this.handleChange.bind(this)} onConfirm={this.handleSubmit.bind(this)} />
        {/* bind要加上，不然this.state会取不到 */}
        <Button onClick={this.handleSubmit.bind(this)}>add</Button>
      </View>
    )
  }
}
export default CustomInput;